export default {
    methods: {
        /**
         * 为element-ui的Select和Cascader添加弹层底部操作按钮
         * @visible-change="v => selectBottomAction(v, {ref: 'select', label: '物料分类' , icon: 'el-icon-menu', click: goodsTypeManagement})"
         * @param visible
         * @param ref      设定的ref名称
         * @param click    底部操作按钮点击监听
         * @param label    标题
         * @param icon     图标class
         * @param arrow    是否显示箭头
         */
        selectBottomAction(visible, data, { ref, click, label = '', icon = '', arrow = false }) {
            if (visible) {
                const _ref = this.$refs[ref];
                let popper = _ref.$refs.popper;
                if (popper.$el) {
                    popper = popper.$el;
                }
                if (!Array.from(popper.children).some(v => v.className === 'el-cascader-menu__list')) {
                    const el = document.createElement('ul');
                    el.className = 'el-cascader-menu__list';
                    el.style = 'border-top: 1px solid #E4E7ED; padding: 0; color: #606266;';
                    el.innerHTML = `<li class="el-cascader-node" style="height:24px;line-height: 24px">
                                    ${ icon ? `<i class="${ icon }"></i>` : '' }
                                    <span class="el-cascader-node__label" style="font-size: 12px;">${ label }</span>
                                    ${ arrow ? '<i class="el-icon-arrow-right el-cascader-node__postfix"/>' : '' }
                                    </li>`;
                    popper.appendChild(el);
                    el.onclick = e => {
                        e.stopPropagation();
                        click && click();
                        if (_ref.toggleDropDownVisible) {
                            _ref.toggleDropDownVisible(false);
                        } else {
                            _ref.visible = false;
                        }
                    };
                    $(popper).find('.el-cascader-menu__list').css({
                        borderTop: '1px solid #E4E7ED',
                    });
                }
            }
        },
    },
};
